<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>WebSocket Client with Dynamic JSON</title>
</head>
<body>
<h2>WebSocket Test Client with Dynamic JSON</h2>
<button id="connectBtn">Connect</button>
<button id="disconnectBtn" disabled>Disconnect</button><br><br>
Command: <input type="number" id="cmdInput" placeholder="Enter Command (byte)" /><br><br>
<div id="keyValuePairs">
    Key: <input type="text" class="keyInput" placeholder="Enter Key" />
    Value: <input type="text" class="valueInput" placeholder="Enter Value" />
</div>
<button id="addPairBtn">Add Another Key-Value Pair</button><br><br>
<button id="sendBtn" disabled>Send Message</button><br><br>
<textarea id="messagesArea" rows="10" cols="50" readonly></textarea>
<script src="app.js"></script>
</body>
</html>
